<div nz-row *ngIf="dataSet!=null || dataSet!=undefined">
  <div nz-col [nzSpan]="6" style="float:left">
    <nz-input-group [nzSuffix]="suffixIconSearch" style="width: 400px">
      <input type="text" nz-input placeholder="请输入搜索内容..." [(ngModel)]="filter" (keyup.enter)="getCVEPage(true)">
    </nz-input-group>
    <ng-template #suffixIconSearch>
      <i nz-icon type="search"></i>
    </ng-template>
  </div>
  <div nz-col [nzSpan]="18" style="text-align: right">
    <button nz-button nzType="primary">
      <i nz-icon type="download" theme="outline"></i>
      下载
    </button>
  </div>
</div>


<div class="custom_table">
  <nz-table #ajaxTable nzShowSizeChanger [nzFrontPagination]="false" [nzData]="dataSet" [nzTotal]="total"
    [nzLoading]="loading" [(nzPageIndex)]="pageIndex" [(nzPageSize)]="pageSize" (nzPageIndexChange)="getCVEPage()"
    (nzCurrentPageDataChange)="currentPageDataChange($event)" (nzPageSizeChange)="getCVEPage(true)">
    <thead (nzSortChange)="sort($event)" nzSingleSort>
      <tr>
        <th nzShowCheckbox [(nzChecked)]="allChecked" [nzIndeterminate]="indeterminate"
          (nzCheckedChange)="checkAll($event)"></th>
        <th nzShowSort nzSortKey="name">CVE</th>
        <th nzShowSort nzSortKey="name">CVSS</th>
        <th><span>利用难度</span></th>
        <th><span>目标资产</span></th>
        <th><span>影响应用</span></th>
        <th><span>服务器</span></th>
        <th><span>操作</span></th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let data of ajaxTable.data">
        <td nzShowCheckbox [(nzChecked)]="data.checked" (nzCheckedChange)="refreshStatus()"></td>
        <td>
          <a routerLink="/layout/threat/threat-list-detail" [queryParams]="{cveName: data?.cveName}">
            {{ data.cveName }}
          </a>
        </td>
        <td>
          <span class="danger">
            <ng-container *ngIf="data?.cvss; else noData">
              {{ data.cvss }}
            </ng-container>
            <ng-template #noData>
              --
            </ng-template>


          </span>
        </td>
        <td>
          <!-- 加个样式 -->
          <div class="grade">
            <span [ngSwitch]="data?.difficulty">
              <p *ngSwitchCase="'难'" class="grade-E">
                {{ data.difficulty }}
              </p>
              <p *ngSwitchCase="'中等'" class="grade-D">
                {{ data.difficulty }}
              </p>

              <p *ngSwitchCase="'简单'" class="grade-A">
                {{ data.difficulty }}
              </p>
              <p *ngSwitchDefault>
                默认
              </p>
            </span>
          </div>
        </td>
        <td>
          <!-- <a href="javascript:;" *ngFor="let targetAsset of data?.targetAssets">
              {{ targetAsset.name }}
            <br>
          </a> -->
          <a href="javascript:;">
            <span>
              <span *ngFor="let targetAsset of data?.targetAssets;let key=index">
                {{ targetAsset.name }}
                <br>
              </span>
              <br>
              <!-- <ng-container *ngIf="data?.targetAssets.length < 2; else more">
                <span *ngFor="let targetAsset of data?.targetAssets;let key=index">
                  {{ targetAsset.name }}
                </span>
              </ng-container>
              <ng-template #more>
                <span>
                  {{ data?.targetAssets[0].name }}
                  <br>
                  更多...
                </span>

              </ng-template> -->

            </span>


          </a>
        </td>
        <td>
          <a href="javascript:;" *ngFor="let influenceApp of data?.influenceApp">
            {{ influenceApp.name }}
            <br>
          </a>
        </td>
        <td>
          <a href="javascript:;" *ngFor="let item of data?.serverIp;let key=index">
            {{ data?.serverIp[key]}}
            <br>
          </a>
        </td>
        <td>
          <button nz-button nzType="primary">确定</button>
        </td>
      </tr>
    </tbody>
  </nz-table>
</div>
